<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="UTF-8" />
		<title>计划列表</title>
		
		<link rel="stylesheet" th:href="@{/css/layout.css}" />
	</head>
	<body>
		<div class="container">
			<form>
				<div class="function-bar">
					<div class="search-item">
						<span>开始日期</span>
						<input id="startDate" type="date"/>
					</div>
					<div class="search-item">
						<span>结束日期</span>
						<input id="endDate" type="date"/>
					</div>
					<div class="search-item">
						<span>用户名称</span>
						<input id="userName" type="text"/>
					</div>
					<div class="search-item">
						<span>计划名称</span>
						<input id="planName" type="text"/>
					</div>
				</div>
				<div class="function-bar btn-bar">
					<div class="search-item">
						<input type="button" class="btn" value="导入" onclick="importPlan()">
						<input type="button" class="btn" value="查询" onclick="query()">
						<input type="reset" class="btn" value="清空" >
					</div>
				</div>
			</form>
			
			<form id="fileForm" th:action="@{/plan/upload}" method="post" enctype="multipart/form-data">
				<input type="file" id="file" name="file" onchange="getFilePath()" style="filter:alpha(opacity=0);opacity:0;width: 0;height: 0;"/>
			</form>
			
			<div class="content">
				<table class="table">
					<thead>
        				<tr>
          					<th>#</th>
          					<th>计划日期</th>
          					<th>用户ID</th>
          					<th>用户名称</th>
          					<th>部门</th>
          					<th>计划名称</th>
          					<th>数量</th>
          					<th>操作</th>
        				</tr>
      				</thead>
      				<tbody id="tbody">
      					<tr th:each="plan, planStat : ${page}">
      						<td th:text="${planStat.count}"></td>
      						<td th:text="${plan.planDateStr}"></td>
      						<td th:text="${plan.userId}"></td>
      						<td th:text="${plan.userName}"></td>
      						<td th:text="${plan.userDept}"></td>
      						<td th:text="${plan.planName}"></td>
      						<td th:text="${plan.count}"></td>
      						<td><a class="oper-btn" th:href="@{'javascript:modifyPlan(\''+${plan.planId} + '\')'}" >修改</a></td>
      					</tr>
      				</tbody>
				</table>
			</div>
		</div>
		
		<script type="text/javascript" th:src="@{/js/jquery.min.js}"></script>
		<script type="text/javascript" th:inline="javascript">
			var ctx = [[@{/}]];
		</script>
		<script type="text/javascript" th:src="@{/js/plan/plan.list.js}"></script>
	</body>
</html>